<script setup lang="ts">
import UvLine from '@/uv-ui/components/nv-line/uv-line.vue'

function handleClickLeft() {
  uni.navigateBack()
}

function toAdd() {
  uni.navigateTo({
    url: '/pages/mobileOrdering/moreSetting/remarkAdd',
  })
}
</script>

<template>
  <view class="h-full flex flex-col overflow-hidden bg-white">
    <wd-navbar
      title="备注标签"
      left-text="返回"
      :bordered="true"
      left-arrow
      @click-left="handleClickLeft"
    />
    <view class="flex flex-1 flex-col overflow-hidden">
      <view class="py-[10px] pl-[15px]">
        <wd-text text="最多启用10个，已启用1个" size="14px" color="#333" />
        <view class="mt-4">
          <uv-line />
        </view>
      </view>
      <scroll-view class="flex-1 overflow-hidden">
        <wd-cell-group border>
          <wd-cell title="自定义的名称1" is-link>
            <wd-text text="启用" />
          </wd-cell>
          <wd-cell title="自定义的名称2" is-link>
            <wd-text text="未启用" />
          </wd-cell>
        </wd-cell-group>
      </scroll-view>
    </view>
    <view class="flex border-t-1 border-border border-t-solid bg-white p-4">
      <wd-button
        class="flex-1 !border-1 !border-border !border-solid !text-primary"
        type="info"
        :round="false"
        @click="toAdd"
      >
        添加
      </wd-button>
      <wd-button type="primary" :round="false" class="ml-4 flex-1">保存</wd-button>
    </view>
  </view>
</template>

<style scoped lang="scss"></style>
